<template>
  <a-modal class="common-modal" :title="title" :footer="null" :width="550" :scroll="{ y: 440 }" :visible="visible" :confirmLoading="confirmLoading" @cancel="handleCancel" :maskClosable="false" style="top:5%;">
    <a-spin :spinning="loading"> 
      <div class="ml-20 mt-20 mb-20" >
        <a-space :size="10">
          <a-button
            style="border-radius: 2px"
            type="primary"
            @click="onCheckedAllStart(1)"
            >{{ $t('other.startAllWireBodies') }}</a-button
          >
          <a-button
            style="border-radius: 2px"
            ghost
            type="primary"
            danger
            @click="onCheckedAllStart(0)"
            >{{ $t('other.closeAllWireBodies') }}</a-button
          >
        </a-space>
      </div>
      <div class="pb-20">
        <a-card class="header-more-card" style="padding-bottom: 20px">
          <a-card v-for="(item, key) in dataList" :key="key">
            <template #title>
              <check-circle-filled
                :style="{ color: '#46C253' }"
                v-if="item.status"
              />
              <minus-circle-filled :style="{ color: '#BCBCBC' }" v-else />
              {{ item.name + "(" + item.lineNo + ")" }}
            </template>
            <template #extra>
              <a-switch
                v-model:checked="item.status"
                @click="onStart(item.lineNo, 1)"
                v-if="!item.status"
              />
              <a-switch
                v-model:checked="item.status"
                @click="onStart(item.lineNo, 0)"
                v-else
              />
            </template>

            <div v-if="item.bridgeVOS.length >0" class="header-more-card-child">
              <div v-for="(record,key1) in item.bridgeVOS" :key="key1" >
                <span v-if="record.loginStatus" :style="{color:'#666'}" >{{$t('hangManage.bridgeStation')}}{{ record.stationNo }}  {{ '(' + record.loginStaffNo+'-'+ record.loginStaffName + ')' }}</span>
                <span v-else :style="{color:'#BCBCBC'}"> {{$t('hangManage.bridgeStation')}} {{ record.stationNo }} ({{$t('other.notLog')}}) </span>
              </div>
            </div>
          </a-card>
        </a-card>
      </div>
    </a-spin>
  </a-modal>
</template>

<script setup>
import { nextTick, ref } from "vue";
import axios from "@/utils/request";
import { getLocalStorage } from "@/utils";
import {message} from "ant-design-vue";
import i18n from '@/locales/index'

const { t } = i18n.global
import { store } from "@/store";
import { CheckCircleFilled, MinusCircleFilled } from "@ant-design/icons-vue";

const emits = defineEmits(["ok", "cancel"]);
let title = ref("");
let visible = ref(false);
let loading = ref(false);
let confirmLoading = ref(false);
let formState = ref({});
let checkedAllStart = ref(false);
let checkedAllLogin = ref(false);
let dataList = ref([]);
// 单个启动/关闭
const onStart = async (lineNo, state) => {
  let param = [];
  param.push({
    line: lineNo,
    startUp: state,
  });
  let url =
    state == 1
      ? "/api/device/line-control/run"
      : "/api/device/line-control/stop";
  await doParam(url, param);
};
// 一键启动
const onCheckedAllStart = async (state) => {
  let url =
    state == 1
      ? "/api/device/line-control/run"
      : "/api/device/line-control/stop";
  // console.log(dataList.value)
  let param = [];
  dataList.value &&
    dataList.value.forEach((item) => {
      param.push({
        line: item.lineNo,
        startUp: state,
      });
    });
  await doParam(url, param);
};
const doParam = async (url, param) => {
  if (!param || !url) return;
  try {
    const res = await axios.postAction(url, param);
    if (res.success) {
      await initModal();
      updateCurrentLine(param);
      emits("ok");
      message.success(res.msg || t('common.doSuccess'))
    }else {
      message.error(res.msg || t('common.doError'))
    }
  } catch {
    console.log("err");
  }
};
const updateCurrentLine = (param) => {
  // 之后根据状态更改
  let currentLine = getLocalStorage("currentLine");
  let currentLineStatus = getLocalStorage("currentLineStatus");
  param &&
    param.forEach((item) => {
      if (item.line == currentLine.lineNo) {
        currentLine.status = item.startUp == 1 ? true : false;
        currentLineStatus = item.startUp == 1 ? true : false;
      }
    });
  localStorage.setItem("currentLine", JSON.stringify(currentLine));
  localStorage.setItem("currentLineStatus", JSON.stringify(currentLineStatus));
  store.commit("updateState", { currentLine: currentLine });
};
const open = async () => {
  title.value = t('other.fullLineBody');
  loading.value = true;
  visible.value = true;
  checkedAllStart.value = false;
  checkedAllLogin.value = false;
  await initModal();
  await nextTick();
};
const initModal = async () => {
  try {
    const res = await axios.postAction(
      "/api/device/line-control/get-line-list"
    );
    if (res.success) {
      dataList.value = res.data || [];
    }
    loading.value = false;
  } catch (e) {
    loading.value = false;
  }
};
const handleCancel = () => {
  formState.value = {};
  visible.value = false;
  loading.value = false;
  emits("cancel");
};

defineExpose({
  open,
});
</script>